<style scoped lang="scss">
.small{
     font-size: 12px;
}
</style>
<template>
    <div style="position: relative;">
<!--        <div style="position: absolute;top:0px;right: 0px;z-index:999" v-if="$props.edit">
            <template v-if="$props.props_show_close">
                <svg-icon icon-class="close-circle"
                          style="font-size: 14px;color: red;position: relative;top: -2px;right: -2px;"
                          @click.native="()=>{
       triggerDelete()
      }"></svg-icon>
            </template>
        </div>-->
        <div :style="`display: ${$props.props_edit?'block':'flex'};`">
            <div style="display: flex;justify-content: space-between;padding-right: 20px;margin-bottom: 5px;">
              <label for="">
                <span><strong>{{ $props.secItem?.processName }}</strong></span>

                  <template v-if="$props.props_materialReceivingDtl?.payState">
                    <dic-tag code="material_receiving_paystate"
                             style="margin-left: 4px;margin-bottom: 2px;margin-top: 4px;"
                             :value="$props.props_materialReceivingDtl?.payState"></dic-tag>
                  </template>
                  <template v-if="1==1">
                    <van-tag size="mini" type="success"
                             style="margin-left: 4px;margin-bottom: 2px;margin-top: 4px;"
                             v-if="$props.props_materialReceivingDtl?.expenseType==5">
                      <span>可报销</span>
                    </van-tag>
                    <van-tag size="mini" type="danger"
                             style="margin-left: 4px;margin-bottom: 2px;margin-top: 4px;"
                             v-if="$props.props_materialReceivingDtl?.expenseType==1">
                      <span>不可报销</span>
                    </van-tag>
                  </template>

              </label>

                <template v-if="computed_edit">
                    <van-button size="mini" type="primary" plain @click="()=>{
                         triggerZhuansong()
                        }">
                        <span v-if="exitZhuansong">取消专送费</span>
                        <span v-else>添加专送费</span>
                    </van-button>
                </template>

            </div>



            <template v-if="1==1" desc="金额 数量">
                <div v-if="computed_edit">
                    <div>
                        <span style="padding-right: 4px;" class="small"><i class="red" v-if="computed_validateProssMoney" style="padding-right: 2px;">*</i>金额:</span>
                        <input-number100 v-model="$props.secItem.processMoney" style="width: 88px"
                                         @change="()=>{
           $emit('updateMoney')
        }"
                        ></input-number100>


                        <span style="margin-left: 20px;padding-right: 4px" class="small">数量:</span>
                        <input-number100 v-model="$props.secItem.processNum" style="width: 88px"></input-number100>
                    </div>
                </div>
                <div v-else>
                    <label>
                        <strong class="small">金额:</strong>
                        <span v-if="$props.secItem.processMoney">{{ toFixedInt($props.secItem.processMoney) }}</span>
                        <span v-else>--</span>
                    </label>

                    <label style="margin-left: 20px;">
                        <strong class="small">数量:</strong>
                        <span v-if="$props.secItem.processNum">{{ toFixedInt($props.secItem.processNum) }}</span>
                        <span v-else>--</span>
                    </label>

                    <label for=""  v-if="$props.secItem.courierMoney" style="padding-left:10px;">
                        <small class="small">专送:</small> <small>{{ toFixedInt($props.secItem.courierMoney) }}</small>
                    </label>
                </div>
            </template>



        </div>
        <!-- 是否专送  -->
        <template v-if="$props.props_edit">
            <div v-if="exitZhuansong" style="border-top: 1px solid #ddd;padding-top: 10px;margin-top: 10px">
                <div style="display: flex;justify-content: space-between;margin-bottom: 10px;">
                    <span style="padding-right: 4px;" class="small">专送费：</span>
                    <template v-if="1==1">
                        <template v-if="computed_edit">
                            <inputNumber100 style="width: 88px;" v-model="$props.secItem.courierMoney"
                                            @change="()=>{

             $emit('updateMoney')
            }"
                            />
                        </template>
                        <template v-else>
                            <span>{{ toFixedInt($props.secItem.courierMoney) }}</span>
                        </template>
                    </template>

                </div>
                <div style="display: flex;align-items: flex-start;justify-content: space-between;">
                    <span class="small"><i class="red" v-if="computed_zhuansong" style="padding-right: 2px;">*</i>附件：</span>
                    <uploadImagePlus
                        :fileList="($props?.secItem?.attachList||[]).filter(item=>item.expendType==`${$props?.secItem?.processName||''}二次工艺专送`)"
                        :uploadType="$uploadType.file_purchase"
                        :disabled="!computed_edit"
                        :maxCount="2"
                        ref="uploadImageDom"
                        expendType="4"
                        @change="files=>{
                              var attachListFilter_no=($props?.secItem?.attachList||[]).filter(item=>item.expendType!=`${$props?.secItem?.processName||''}二次工艺专送`);
                              $props.secItem.attachList=(attachListFilter_no).concat(files.map(item=>{
                                  item.expendType=`${$props?.secItem?.processName||''}二次工艺专送`
                                  return  item
                              }))
                           }"
                    >
                    </uploadImagePlus>
                </div>
            </div>
        </template>
    </div>
</template>
<script>
import uploadFilePlusCom from '@/components/UploadImage/uploadFilePlus.vue';
import { toFixedInt } from '@/utils';
import uploadImagePlus from '@/components/UploadImage/uploadImagePlus.vue';
import inputNumber100 from '@/components/inputNumber/inputNumber100.vue';
import { alertConfirm } from '@/utils/alertUtil';
import DicTag from '@/components/DicTag/dic-tag.vue';

export default {
    components: {
      DicTag,
        inputNumber100, uploadImagePlus,
        uploadFilePlusCom,
    },
    props: {
        //是否 显示转送编辑区域
        props_show_edit_zhuansong: {
            type: [Boolean], default() {
                return false;
            },
        },
        props_edit: {
            type: [Boolean], default() {
                return false;
            },
        },
        secItem: {
            type: [Object],
        },
      props_materialReceivingDtl: {
            type: [Object],
        },
        props_props_billingType: {
            type: [String, Number],
        },
        props_show_close: {
            type: [Boolean], default() {
                return true;
            },
        },
      props_activeName:{
        type: [String, Number],
      }
    },
    data() {
        return {
            exitZhuansong: this.$props.secItem?.courierMoney > 0,
            toFixedInt,
        };
    },
    computed: {
      computed_edit() {
        if(this.$props.props_materialReceivingDtl?.payState>1){
        return false
        }
        return this.$props.props_edit;
      },

        computed_validateProssMoney() {
            if (this.$props.props_props_billingType == 5) {
                return false;
            }

            //排除  固色 洗水(这2个可以为0)
            var ignoreListName = ['固色', '洗水'];
            if (ignoreListName.includes(this.$props.secItem.processName)) {
                return false;
            }
            return true;
        },
        computed_zhuansong() {
            if (this.$props.props_props_billingType == 5) {
                return false;
            }
            if (this.$props.secItem.courierMoney > 0) {
                var ignoreListName = ['固色', '洗水'];
                if (ignoreListName.includes(this.$props.secItem.processName)) {
                    return false;
                }
                return true;
            }
        },
    },
    methods: {
        async triggerDelete() {
            await alertConfirm('确定删除吗？');
            this.$emit('triggerDelete');
        },
        triggerZhuansong() {
            this.exitZhuansong = !this.exitZhuansong;
            if (!this.exitZhuansong) {
                this.$props.secItem.courierMoney = '';
                var attachList = this.$props?.secItem?.attachList || [];
                var attachListFilter_no = (attachList || []).filter(item => item.expendType != '二次工艺专送');
                this.$props.secItem.attachList = attachListFilter_no || [];
            }
        },


    },
};
</script>
